<template>
	<view class="question-item" @click="toInfo" :style="{
		marginBottom: bottom ? '0' : '20px'
	}">
		<view>
			<view class="_title">{{ info.chapter.name }}</view>
			<view class="_desc">{{ info.content }}</view>
		</view>
		<view class="iconfont main-color f-s-28">&#xe6ae;</view>
	</view>
</template>

<script setup>
	const props = defineProps({
		bottom: {
			type: Boolean,
			default: false
		},
		info: {
			type: Object,
			default: () => ({})
		}
	})
	
	const toInfo = () => {
		uni.navigateTo({
			url: `/subPackages/subject/quesInfo?id=${props.info.id}`
		})
	}
	
</script>

<style scoped lang="scss">
	.question-item{
		margin: 20px;
		background: #fff;
		border-radius: 8px;
		padding: 16px 20px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		._title{
			font-size: 16px;
			font-weight: bold;
			color: #1D2129;
		}
		._desc{
			margin-top: 6px;
			font-size: 12px;
			color: #86909C;
		}
	}

</style>